<!--
 @Author: libing/makeup1122
 @Email: makeup1123@163.com
 @Date: "2020-04-03 14:07:14"
-->
<template>
  <v-combobox
    dense
    prepend-icon="filter_vintage"
    hint="可以手动填写新标签，按回车即可提交！"
    :value="value"
    :items="items"
    item-text="name"
    :loading="loading"
    :disabled="loading"
    chips
    small-chips
    label="标签"
    @change="changeHandle"
    multiple
  ></v-combobox>
</template>
<script>
import * as API from '@/api/admin/tags.js'
export default {
  name: 'TagsSelect',
  props: {
    value: {
      type: Array,
      default: () => { return [] }
    }
  },
  components: {},
  data: function () {
    return {
      items: [],
      loading: true
    }
  },
  computed: {},
  created: function () {
    this.loading = true
    API.fetchList({
      page_size: -1
    }).then(res => {
      this.items = res.data.data
      this.items.unshift({ header: '可以手动填写新标签，按回车即可提交！' })
    }).finally(() => {
      this.loading = false
    })
  },
  methods: {
    changeHandle(e) {
      let v = []
      e.forEach(element => {
        if (typeof element === 'object') {
          v.push(element.name)
        } else if (typeof element === 'string') {
          v.push(element)
        } else {
          return false
        }
      })
      this.$emit('input', v)
    }
  }
}
</script>
<style scoped>
</style>
